<template>
    <div>
        <div class="imgbox">

            <img src="../../assets/img/团队logo.jpg" width="135px" height="135px"/>

        </div>
        <el-menu :default-active="activeIndex" class="el-menu-demo nva_style" mode="horizontal" @select="handleSelect">
            <el-row>
                <el-col :span="7">
                    <div class="grid-content"></div>
                </el-col>
                <!--                <el-col :span="12">-->
                <!--                    <h1 class="">半点时光甜品店</h1>-->
                <!--                </el-col>-->
                <el-col :span="2">
                    <el-menu-item index="4" @click="uindex()">首页</el-menu-item>
                </el-col>
                <el-col :span="2">
                    <el-menu-item index="4" @click="movies()">稻瘟病</el-menu-item>
                </el-col>
                <el-col :span="2">
                    <el-menu-item index="4" @click="books()">白叶枯病</el-menu-item>
                </el-col>
                <el-col :span="2">
                    <el-menu-item index="4" @click="musics()">水稻曲病</el-menu-item>
                </el-col>
                <el-col :span="2">
                    <el-menu-item index="4" @click="pictures()" align="center">识别</el-menu-item>
                </el-col>

                <el-col :span="2">
                    <el-submenu index="2">
                        <template slot="title">用户中心</template>
                        <!--el-menu-item index="2-1" @click="shoppingCart()">购物车</el-menu-item-->
                        <el-menu-item index="2-2" @click="edit()">信息修改</el-menu-item>
                        <el-menu-item index="2-3" @click="loginOut()">退出登录</el-menu-item>
                    </el-submenu>
                </el-col>
                <el-col :span="3">
                </el-col>
            </el-row>
        </el-menu>
        <!--    轮播图-->

        <el-row class="er1">
            <el-col :span="2">
                <div class="grid-content"></div>
            </el-col>
            <el-col :span="20">
                <template>
                    <el-carousel :interval="6000"  height="600px">
                        <el-carousel-item v-for="item in imagesbox" :key="item.id">
                            <div class="imgh" @click="cake(item.id)"><img :src="item.cakePic" class="image"></div>
                            <div class="ephbottom">
                                <div class="ephline">
                                </div>
                                <div class="ephtext1">{{item.cakeName}}
                                </div>
                                <div class="ephtext2">{{item.tt}}
                                </div>
                            </div>
                        </el-carousel-item>
                    </el-carousel>
                </template>
            </el-col>
            <el-col :span="3">
            </el-col>
        </el-row>
        <!--    电影-->

<!--        <el-row class="er1">-->
<!--            <el-col :span="2">-->
<!--                <div class="grid-content"></div>-->
<!--            </el-col>-->
<!--            <el-col :span="20">-->
<!--                <div class="el-icon-video-camera-solid">蛋糕班戟</div>-->
<!--                <el-tabs v-model="activeName" @tab-click="handleClick">-->
<!--                    <el-row>-->
<!--                        <el-col :span="3"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[0].cakePic class="table-td-thumb"  @click="cake(cake_img[0].id)">-->
<!--                            <h5>{{cake_img[0].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[0].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                        <el-col :span="3"><div class="grid-content bg-purple"></div></el-col>-->
<!--                        <el-col :span="3"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[1].cakePic class="table-td-thumb"   @click="cake(cake_img[1].id )">-->
<!--                            <h5>{{cake_img[1].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[1].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                        <el-col :span="3"><div class="grid-content bg-purple"></div></el-col>-->
<!--                        <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[2].cakePic class="table-td-thumb"  @click="cake(cake_img[2].id )">-->
<!--                            <h5>{{cake_img[2].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[2].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                        <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                        <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[3].cakePic class="table-td-thumb"  @click="cake(cake_img[3].id )">-->
<!--                            <h5>{{cake_img[3].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[3].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                    </el-row>-->
<!--                    <el-row class="er2">-->
<!--                        <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[4].cakePic class="table-td-thumb"  @click="cake(cake_img[4].id )">-->
<!--                            <h5>{{cake_img[4].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[4].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                        <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                        <el-col :span="4"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[5].cakePic class="table-td-thumb"   @click="cake(cake_img[5].id )">-->
<!--                            <h5>{{cake_img[5].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[5].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                        <el-col :span="2"><div class="grid-content bg-purple"></div></el-col>-->
<!--                        <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[6].cakePic class="table-td-thumb"  @click="cake(cake_img[6].id )">-->
<!--                            <h5>{{cake_img[6].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[6].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                        <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                        <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                            <img :src=cake_img[7].cakePic class="table-td-thumb"  @click="cake(cake_img[7].id )">-->
<!--                            <h5>{{cake_img[7].cakeName}}</h5>-->
<!--                            <div class="block">-->
<!--                                <el-rate-->
<!--                                        disabled-->
<!--                                        v-model="cake_img[7].grade"-->
<!--                                        :colors="colors">-->
<!--                                </el-rate>-->
<!--                            </div>-->
<!--                        </div></el-col>-->
<!--                    </el-row>-->
<!--                </el-tabs>-->

<!--            </el-col>-->
<!--            <el-col :span="3">-->
<!--            </el-col>-->
<!--        </el-row>-->
<!--        < !&#45;&#45;  dessert&ndash;&gt;-->
<!--        <el-row class="er1">-->
<!--            <el-col :span="2">-->
<!--                <div class="grid-content"></div>-->
<!--            </el-col>-->
<!--            <el-col :span="20">-->
<!--                <div class="el-icon-reading">清凉解暑</div>-->
<!--                <el-row>-->
<!--                    <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                        <                   <img :src=book[0].dessertPic class="image"  @click="u_dessert(book[0].id )">&ndash;&gt;-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[0].dessertPic"-->
<!--                                :preview-src-list="[dessert[0].dessertPic]"-->
<!--                                @click="u_dessert(dessert[0].id )"-->
<!--                        ></el-image>-->

<!--                        <h5>{{dessert[0].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[1].dessertPic"-->
<!--                                :preview-src-list="[dessert[1].dessertPic]"-->
<!--                                @click="u_dessert(dessert[1].id )"-->
<!--                        ></el-image>-->
<!--                        <h5>{{dessert[1].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[2].dessertPic"-->
<!--                                :preview-src-list="[dessert[2].dessertPic]"-->
<!--                                @click="u_dessert(dessert[2].id )"-->
<!--                        ></el-image>-->
<!--                        <h5>{{dessert[2].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[3].dessertPic"-->
<!--                                :preview-src-list="[dessert[3].dessertPic]"-->
<!--                                @click="u_dessert(dessert[3].id )"-->
<!--                        ></el-image>-->
<!--                        <h5>{{dessert[3].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                </el-row>-->
<!--                <el-row >-->
<!--                    <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[4].dessertPic"-->
<!--                                :preview-src-list="[dessert[4].dessertPic]"-->
<!--                                @click="u_dessert(dessert[4].id )"-->
<!--                        ></el-image>-->
<!--                        <h5>{{dessert[4].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="4"><div class="grid-content bg-purple">-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[5].dessertPic"-->
<!--                                :preview-src-list="[dessert[5].dessertPic]"-->
<!--                                @click="u_dessert(dessert[5].id )"-->
<!--                        ></el-image>-->
<!--                        <h5>{{dessert[5].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="2"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[6].dessertPic"-->
<!--                                :preview-src-list="[dessert[6].dessertPic]"-->
<!--                                @click="u_dessert(dessert[6].id )"-->
<!--                        ></el-image>-->
<!--                        <h5>{{dessert[6].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="1"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="5"><div class="grid-content bg-purple">-->
<!--                        <el-image-->
<!--                                class="table-td-thumb"-->
<!--                                :src="dessert[7].dessertPic"-->
<!--                                :preview-src-list="[dessert[7].dessertPic]"-->
<!--                                @click="u_dessert(dessert[7].id )"-->
<!--                        ></el-image>-->
<!--                        <h5>{{dessert[7].dessertName}}</h5>-->
<!--                    </div></el-col>-->
<!--                </el-row>-->
<!--            </el-col>-->
<!--            <el-col :span="3">-->
<!--            </el-col>-->
<!--        </el-row>-->
<!--        &lt;!&ndash;    pudding&ndash;&gt;-->
<!--        <el-row class="er1">-->
<!--            <el-col :span="2">-->
<!--                <div class="grid-content"></div>-->
<!--            </el-col>-->
<!--            <el-col :span="20">-->
<!--                <div class="el-icon-reading">蛋挞布丁</div>-->
<!--                <el-row>-->
<!--                    <el-col :span="0"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="6"><div class="grid-content bg-purple">-->
<!--                        <img :src=pudding[0].poster class="image"  @click="u_pudding(pudding[0].id )">-->
<!--                        <h5>{{pudding[0].name}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="0"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="6"><div class="grid-content bg-purple">-->
<!--                        <img :src=pudding[1].poster class="image"   @click="u_pudding(pudding[1].id )">-->
<!--                        <h5>{{pudding[1].name}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="0"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="6"><div class="grid-content bg-purple">-->
<!--                        <img :src=pudding[2].poster class="image"  @click="u_pudding(pudding[2].id )">-->
<!--                        <h5>{{pudding[2].name}}</h5>-->
<!--                    </div></el-col>-->
<!--                    <el-col :span="0"><div class="grid-content bg-purple"></div></el-col>-->
<!--                    <el-col :span="6"><div class="grid-content bg-purple">-->
<!--                        <img :src=pudding[3].poster class="image"  @click="u_pudding(pudding[3].id )">-->
<!--                        <h5>{{pudding[3].name}}</h5>-->
<!--                    </div></el-col>-->
<!--                </el-row>-->
<!--            </el-col>-->
<!--            <el-col :span="3">-->
<!--            </el-col>-->
<!--        </el-row>-->
    </div>
</template>

<script>
    import axios from 'axios'
    export default {
        name: "LoginUserIndex",
        data(){
            return {
                value2: null,
                colors: ['#99A9BF', '#F7BA2A', '#FF9900'],
                isLogin:false,
                activeName: 'first1',
                imagesbox:[{id:0,idView:require("../../assets/img/timg.jpg"),th:"龙猫1",tt:"啊实打实大阿打算打算打打as打的"},{id:1,idView:require("../../assets/img/timg.jpg"),th:"龙猫2",tt:"啊实打实大阿打算打算打打as打的"},
                    {id:2,idView:require("../../assets/img/timg.jpg"),th:"龙猫2",tt:"啊实打实大阿打算打算打打as打的"}],
                cake_img:[],
                cake_img2:[],
                cake_img3:[],
                cake_img4:[],
                dessert:[],
                pudding:[{id:0,idView:require("../../assets/img/timg.jpg"),name:"阿萨达"},{id:1,idView:require("../../assets/img/timg.jpg"),name:"阿萨达"},
                    {id:2,idView:require("../../assets/img/timg.jpg"),name:"阿萨达"},{id:3,idView:require("../../assets/img/timg.jpg"),name:"阿萨达"}]
            }
        },
        created() {
            this.getData()
        },
        methods: {
            getData() {
                axios.get("http://localhost:8083/dessert/getDessertAll")
                    .then(response => {
                        if(response.data){
                            console.log(response.data);
                            this.dessert = [];
                            this.dessert = response.data;
                        }
                    })
                    .catch(error => {
                        console.log(error.message);
                        alert(error.message);
                    });
                axios.get("http://localhost:8083/cake/getCakeAll")
                    .then(response => {
                        if(response.data){
                            console.log(response.data);
                            this.cake_img = [];
                            this.cake_img = response.data;
                            this.cake_img2 = [];
                            this.cake_img2= response.data;
                            this.cake_img3 = [];
                            this.cake_img3 = response.data;
                            this.cake_img4 = [];
                            this.cake_img4 = response.data;
                        }
                    })
                    .catch(error => {
                        console.log(error.message);
                        alert(error.message);
                    })
                axios.get("http://localhost:8083/cake_r/getCakeRotationAll")
                    .then(response => {
                        if(response.data){
                            console.log(response.data);
                            this.imagesbox = [];
                            this.imagesbox = response.data;
                        }
                    })
                    .catch(error => {
                        console.log(error.message);
                        alert(error.message);
                    })
                axios.get("http://localhost:8083/pudding/getPuddingAll")
                    .then(response => {
                        if(response.data){
                            console.log(response.data);
                            this.pudding = [];
                            this.pudding = response.data;
                        }
                    })
                    .catch(error => {
                        console.log(error.message);
                        alert(error.message);
                    })
            },
            regist(){
                this.$router.push('/u_regist');
            },
            loginOut(){
                localStorage.removeItem('telephone');
                this.$message.success('退出成功');
                this.$router.push('/u_login');
            },
            shoppingCart(){
                if(1){
                    this.$router.push('/u_cart');
                }
                else{
                    this.$router.push('/Judge');
                }
                // this.$router.push('/u_person');

            },
            movie(mid){
                this.$router.push('/u_movie');
            },
            u_book(mid){
                this.$router.push('/u_book');
            },
            u_music(mid){
                this.$router.push('/u_music');
            },
            handleClick(tab, event) {
                console.log(tab, event);
            },
            handleClick2(tab, event) {
                console.log(tab, event);
            },
            uindex(){
                this.$router.push('/u_login_index');
            },
            movies(){
                this.$router.push('/u_movie');
            },
            books(){
                this.$router.push('/u_book');
            },
            musics(){
                this.$router.push('/u_music');
            },
            pictures(){
             this.$router.push('/u_pic');
            },
        },
        mounted() {
        }
    }
</script>

<style scoped>
    .nva_style{

        background-color: #96D67A;

    }
    .table-td-thumb {
        display: block;
        margin: auto;
        width: 260px;
        height: 340px;
    }
    .imgbox{
        text-align: center;
    }
</style>
